<template>
   <router-view />
</template>

<script setup>
function adapter() {
  //1、获取设备独立像素 = css像素 = 视口宽度
  const deviceWidth = document.documentElement.clientWidth;


  //2、计算根字体大小
  //100是假设设计搞的根元素字体大小为100px 375是设计稿的宽度
  const rootFontSize = deviceWidth * 100 / 375

  //3、设置根元素的字体大小
  document.documentElement.style.fontSize = rootFontSize + 'px';
}

//4、页面加载完成，计算跟字体大小
adapter();

//5、当视口改变的时候，重新计算rem
//onresize 事件会在窗口或框架被调整大小时发生
window.onresize = adapter;
</script>

<style>
</style>